/**
* sb8
*/

<template>
    <div class="function-use-content">
        <div class="device-content">
            <div class="title">
                <span class="span-1">{{pageName}}</span>
                <slot name="content"></slot>
                <div class="table-box">
                    <el-table
                            :data="tableList"
                            stripe
                            height="350"
                            style="width: 100%">
                        <el-table-column
                                sortable
                                v-for="(item,index) in tableColumnList"
                                :prop="item.key"
                                :key="item.key+'-' + index"
                                :label="item.name">
                        </el-table-column>

                    </el-table>
                </div>
            </div>
        </div>

    </div>
</template>

<script>
export default {
  created () {
  },
  props: {
    tableList: {
      type: Array
    },
    pageName: {
      tpye: String
    },
    tableColumnList: {
      type: Array
    }
  },
  watch: {
    tableList (now, old) {
      if (now) {
        this.$nextTick().then(() => {
          this.initPage(now)
        })
      }
    }
  },
  data () {
    return {
      arrayList: [],
      model_type: '',
      longTimePage: {}
    }
  },
  methods: {
    initPage (data) {
    }
  }
}
</script>

<style lang="scss" scoped>
    @import "@/assets/scss/modules/variables-module.scss";
    @import "@/assets/scss/modules/common-module.scss";
    .function-use-content{
        .device-content{
            @include device-content;
        }
        .chart-wrap {
            width: 100%;
            height: 100%;
        }
        .use-bottom{
            display: flex;

        }
        .table-box{
            margin-top: 20px;
        }
    }
</style>
